<%--
  Created by IntelliJ IDEA.
  User: zplogo
  Date: 2017/10/30
  Time: 9:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>zTree简单数据格式构建</title>
    <link type="text/css" rel="stylesheet" href="assets/css/zTreeStyle/zTreeStyle.css">
    <script type="text/javascript" src="assets/js/jquery-1.8.3.js"></script>
    <script type="text/javascript" src="assets/js/jquery.ztree.all-3.5.min.js"></script>
    <script type="text/javascript" src="assets/js/jquery.ztree.exhide-3.5.min.js"></script>
    <style>
        .content{
            width:300px;
            height: 600px;
            /*background-color: #00ff00;*/
            overflow: auto;
        }
    </style>
    <script>
        var zTreeObj;

        var setting = {
            view: {
                dblClickExpand: false,
                showLine: true,  //是否显示节点间的连线
                selectedMulti: false,
                expandSpeed: "fast"
            },
            callback: {
                onDblClick: zTreeOnDblClick
            },
            data:
                {
                    key:
                        {
                            name: "treeNodeName"  //界面显示的名称参数
                        },
                    simpleData:
                        {
                            enable: true,
                            idKey: "treeId",
                            pIdKey: "treePid",
                            rootPId: "0"
                        }
                }
        };

        function buildTree() {
            $.post("/zTree/initData", null, function (zNodes) {
                alert(JSON.stringify(zNodes));
//                zTreeObj = $.fn.zTree.init($("#tree"), setting, zNodes);
            });
        }

        function zTreeOnDblClick() {
            alert("zTree双击事件");
        }
        
        $(function () {
            $.post("/zTree/initData.do", null, function (zNodes) {
                var zNodesObj = JSON.parse(zNodes);
                zTreeObj = $.fn.zTree.init($("#tree"), setting, zNodesObj);
            });
        });
    </script>
</head>
<body>
<div class="content">
    <ul id="tree" class="ztree"></ul>
</div>
</html>
